<!DOCTYPE html>
<%@page contentType="text/html; charset=UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<html>
<head>
<%@include file="headScript.jsp"%>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/assets/js/ga/acm1104script.js"></script>
<style type="text/css">
.border-row {
	border-bottom: 1px solid #ccc;
	margin-top: 20px;
	margin-bottom: 20px;
}
</style>

</head>
<body>
	<div class="wrapper">
		<!-- BEGIN Top-Bar -->
		<%@ include file="../fragments/header.jsp"%>
		<!-- END Top-Bar -->

		<div id="detail-area" class="clearfix">
			<!-- BEGIN SIDEMENU -->
			<div class="hidden-xs hidden-sm page-sidebar" id="side-menu-bar">
				<ul class="page-sidebar-menu">
					<li class="info">
						<div class="clearfix">
							<div>
								<strong>ยินดีต้อนรับ</strong>
							</div>
							<div>
								<i class="fa fa-user"></i> Admin
							</div>
							<div class="mt-10">
								<strong>คุณเข้าระบบครั้งล่าสุดเมื่อ</strong>
							</div>
							<div class="mb-10">
								<i class="fa fa-clock-o"></i> 13 / 01 / 2558 14:00:00
							</div>
						</div>
					</li>
					<li class="active"><a href="javascript:void(0)" ><i class="fa fa-briefcase"></i> Agent Management <span class="arrow"></span></a>
			<ul class="sub-menu">
				<li class="active"><a href="javascript:void(0)" ><i class="fa fa-folder"></i> GA : General Agent <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM1101.jsp"><i class="fa fa-coffee"></i> AG </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM11021.jsp"><i class="fa fa-coffee"></i> AL </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM1103.jsp"><i class="fa fa-coffee"></i> AVP </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM1104.jsp" class="active"><i class="fa fa-coffee"></i> VP </a></li>
					</ul>
				</li>
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> SFC <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM1201.jsp"><i class="fa fa-coffee"></i> AG : Financing Allowance </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM1202.jsp"><i class="fa fa-coffee"></i> AG : Recruiting Award </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM1203.jsp"><i class="fa fa-coffee"></i> MM : Incentive </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM1204.jsp"><i class="fa fa-coffee"></i> O/E : Operation Expense </a></li>
					</ul>
				</li>
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> Summary <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM1301.jsp"><i class="fa fa-coffee"></i> GA - AG </a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li><a href="javascript:void(0)"><i class="fa fa-briefcase"></i> Data Management <span class="arrow"></span></a>
			<ul class="sub-menu">
				<li><a href="javascript:void(0)"><i class="fa fa-folder"></i> SFC <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM2101.jsp"><i class="fa fa-coffee"></i> SFC Agent Structure </a></li>
					</ul>
				</li>
				<li><a href="javascript:void(0)"><i class="fa fa-folder"></i> Modify Data <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM2201.jsp"><i class="fa fa-coffee"></i> SFC Agent Structure </a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li><a href="javascript:void(0)" ><i class="fa fa-briefcase"></i> Formula Management <span class="arrow"></span></a>
			<ul class="sub-menu">
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> SFC <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM3101.jsp"><i class="fa fa-coffee"></i> Recruiting Award Management </a></li>
					</ul>
				</li>
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> Adjustment <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM5101.jsp"><i class="fa fa-coffee"></i> Adjustment </a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li><a href="javascript:void(0)" ><i class="fa fa-briefcase"></i> Report Management <span class="arrow"></span></a>
			<ul class="sub-menu">
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> Demo Report <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM4101.jsp"><i class="fa fa-coffee"></i> Report 1 </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM4102.jsp"><i class="fa fa-coffee"></i> Report 2 </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM4103.jsp"><i class="fa fa-coffee"></i> Report 3 </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM4104.jsp"><i class="fa fa-coffee"></i> Report 4 </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM4105.jsp"><i class="fa fa-coffee"></i> Report 5 </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM4106.jsp"><i class="fa fa-coffee"></i> Report 6 </a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li><a href="javascript:void(0)" ><i class="fa fa-briefcase"></i> Financial Management <span class="arrow"></span></a>
			<ul class="sub-menu">
				<li><a href="javascript:void(0)" ><i class="fa fa-folder"></i> Finance <span class="arrow"></span></a>
					<ul class="sub-menu">
						<li><a href="${pageContext.request.contextPath}/content/ACM5102.jsp"><i class="fa fa-coffee"></i> Adjustment </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM5201.jsp"><i class="fa fa-coffee"></i> Tax Calculation </a></li>
						<li><a href="${pageContext.request.contextPath}/content/ACM5202.jsp"><i class="fa fa-coffee"></i> Tax Reduction </a></li>
					</ul>
				</li>
			</ul>
		</li>
					<li><a href="javascript:void()"><i class="fa fa-sign-out"></i>
							ออกจากระบบ </a></li>
				</ul>
			</div>

			<!-- End Side Menu -->

			<div class="col-sm-12 col-xs-12" id="right-side">
				<div id="navigator-bar">
					<i class="fa fa-home"></i> หน้าหลัก <i
						class="fa fa-angle-right ml-5 mr-5"></i> GA : VP
				</div>
				<!--End navigator-bar-->


				<div class="form-list" style="margin-top: -100px;">
					<div class="form-list" id="form-list">

						<h1>${calculationType}</h1>
						<div class="row">

							<div class="col-sm-2">Agent No</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${agentNo}"
									disabled="disabled" style="text-align: right;">
							</div>
						</div>
						<br>
						<div class="row">

							<div class="col-sm-2">Agent Name</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${agentName}"
									disabled="disabled" style="text-align: right;">
							</div>
						</div>
						<div class="border-row"></div>
						<div class="row ">
							<div class="col-sm-2">Bonus(฿)</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${bonus}"
									disabled="disabled" style="text-align: right;">
							</div>

						</div>
						<br>
						<div class="row ">

							<div class="col-sm-2">Quarterly</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${quarterly}"
									disabled="disabled" style="text-align: right;">
							</div>

						</div>
						<br>
						<div class="row ">

							<div class="col-sm-2">Year</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${year}"
									disabled="disabled" style="text-align: right;">
							</div>

						</div>
						<div class="border-row"></div>
						<div class="row">
							<div class="col-sm-2">PC</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${pc}"
									disabled="disabled" style="text-align: right;">
							</div>
							<div>
								<button type="button" class="btn btn-success"
									onclick="searchDataDetail('${agentNo}','${calculationType}','${quarterly}','${year}','${agentName}');">
									<i class="fa fa-search"></i>
								</button>
							</div>
						</div>
						<br>
						<div class="row">
							<div class="col-sm-2">Bonus Rate(%)</div>
							<div class="col-sm-3">
								<input type="text" class="form-control" value="${bonusRate}"
									disabled="disabled" style="text-align: right;">
							</div>
						</div>
						<br>
						<div class="row">
							<div class="col-sm-2">Persistency Rate(%)</div>
							<div class="col-sm-3">
								<input type="text" class="form-control"
									value="${persistencyRate}" disabled="disabled"
									style="text-align: right;">
							</div>

						</div>
						<br>
						<div class="row">

							<div class="col-sm-2">Persistency Credit(%)</div>
							<div class="col-sm-3">
								<input type="text" class="form-control"
									value="${persistencyCredit}" disabled="disabled"
									style="text-align: right;">
							</div>
						</div>
						<div class="border-row"></div>


						<table border="1" style="width: 100%">
							<tr>
								<td width="12%" align="center"></td>
								<td width="12%" align="center">Q1</td>
								<td width="12%" align="center">Q2</td>
								<td width="12%" align="center">Q3</td>
								<td width="12%" align="center">Q4</td>
								<td width="12%" align="center">SumQ</td>
								<td width="12%" align="center">Annual</td>
								<td align="center">Net Anual</td>
							</tr>
							<tr>
								<td align="center">Bonus</td>
								<td align="right">${bonusQ1}</td>
								<td align="right">${bonusQ2}</td>
								<td align="right">${bonusQ3}</td>
								<td align="right">${bonusQ4}</td>
								<td align="right">${sumBonusQ}</td>
								<td align="right">${bonusAnnual}</td>
								<td align="right">${bonusNetBonus}</td>
							</tr>
							<tr>
								<td align="center">Hold</td>
								<td align="right">${holdQ1}</td>
								<td align="right">${holdQ2}</td>
								<td align="right">${holdQ3}</td>
								<td align="right">${holdQ4}</td>
								<td align="right">${sumHoldQ}</td>
								<td align="right">${holdAnnual}</td>
								<td align="right">${holdNetBonus}</td>
							</tr>
						</table>


					</div>
					<!-- list-detail-area-->
				</div>

				<div class="modal fade" id="detailCommission" tabindex="-1"
					role="dialog" aria-labelledby="confirmModal" aria-hidden="true">
					<div class="modal-dialog" style="width: 900px">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal"
									aria-hidden="true">&times;</button>
								<h4 class="modal-title">รายละเอียด Commission</h4>
							</div>
							<div class="modal-body">
								<div id="head_modal_content_detail_commission"
									style="margin-top: -10px;"></div>
								<span id="modal_content_detail_commission">
									<div class="form-list" style="padding: 0px; margin-top: -50px;">
										<div class="form-list" id="form-list">
											<form role="form" name="form" action="../ACM1104Srvl"
												method="POST">
												<div class="list-detail-area">
													<table id="raDataDetailTable"
														class="stripe hover cell-border" cellspacing="0"
														width="100%" align="center">
														<thead>
															<tr
																style="background-color: #132167; color: white; font-size: 0.9em;">
																<th
																	style="border-right: 1px solid #999; text-align: center;">ลำดับ</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">CLOS_YM</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">PE_NO_COL</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">PO_NO</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">FYP-C</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">2<sup>nd</sup>
																	RYP-C
																</th>
																<th
																	style="border-right: 1px solid #999; text-align: center;">PC</th>
															</tr>
														</thead>
													</table>
												</div>
											</form>
										</div>
										<!-- list-detail-area-->
									</div>
								</span>
							</div>
							<div class="modal-footer">
								<button type="submit" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> ปิดรายละเอียด </button>
							</div>
						</div>
					</div>
				</div>







				<div id="footer-detail">Copyright © สงวนลิขสิทธิ์ พ.ศ.2558 โดยบริษัท เอสแคป โซลูชั่นส์ จำกัด</div>
			</div>
		</div>
	</div>
</body>
</html>